<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>光山县旅游产业监控中心</title>
    <link rel="stylesheet" href="./assets/css/animate.min.css">
    <link rel="stylesheet" href="./assets/plugin/M_select/M_select.css">
    <link rel="stylesheet" href="./assets/css/public.css">
    <link rel="stylesheet" href="./assets/css/common.css">
    <link rel="stylesheet" href="./assets/css/tongji_ykhx.css">
</head>
<body>
<div class="box">
    <!--头部-->
    <div class="title-box">
        <div class="title-img">
            <h3>光山县旅游产业监控中心</h3>
        </div>
        <ul class="link-box">
            <li><a href="index.html">人流热力图</a></li>
            <li class="active"><a href="chanye_jq.html">行业运行监测</a></li>
            <li><a href="industryDevelopment.html">行业发展监测</a></li>
            <li><a href="video.html">第三方数据</a></li>
        </ul>
        <div class="title-left">
            <span>光山县</span>
            <span id="weather">小雨转晴</span>
            <span id="temperature">32/23℃</span>
            <span id="windPower">东风</span>
        </div>
    </div>
    <!--主体-->
    <div class="main-box">
        <!--导航-->
        <div class="nav-box">
            <ul>
                <li>
                    <a href="index.html">
                        <div>
                            <img src="./assets/images/icon-index.png">
                            <img src="./assets/images/icon-index-active.png">
                        </div>
                        <p>大数据人流热力图</p>
                    </a>
                </li>
                <li class="active">
                    <a href="./chanye_jq.html">
                        <div>
                            <img src="./assets/images/icon-analysis.png">
                            <img src="./assets/images/icon-analysis-active.png">
                        </div>
                        <p>行业运行监测及统计</p>
                    </a>
                </li>
                <li>
                    <a href="./tongji.html">
                        <div>
                            <img src="./assets/images/icon-operation.png">
                            <img src="./assets/images/icon-operation-active.png">
                        </div>
                        <p>行业发展监测及统计</p>
                    </a>
                </li>
                <li>
                    <a href="./lvyoujia_qx.html">
                        <div>
                            <img src="./assets/images/icon-activity.png">
                            <img src="./assets/images/icon-activity-active.png">
                        </div>
                        <p>第三方数据处理和呈现</p>
                    </a>
                </li>
            </ul>
        </div>
        <!--数据内容-->
        <div class="content-box flex-column">
            <div class="content-nav" style="padding-right: 410px">
                <ul>
                    <li class="active">
                        <a href="#">游客画像分析</a>
                    </li>
                </ul>

                <div class="select-box">
                    <select name="" id="select-scenic" class="scenic">
                        <option value="0">大阳古镇</option>
                        <option value="1">山里泉</option>
                        <option value="2">珏山</option>
                        <option value="3">司徒小镇</option>
                        <option value="4">可寒山</option>
                        <option value="5">栖龙湾</option>
                        <option value="6">聚寿山</option>
                        <option value="7">景熙绿谷</option>
                    </select>
                </div>
                <div class="date-select-list">
                    <div class="radio-box">
                        <input type="radio" id="tody" name="time" checked>
                        <label for="tody">今日</label>
                        <input type="radio" id="month" name="time">
                        <label for="month">本月</label>
                        <input type="text" id="period" placeholder="选择时间段">
                        <button>查询</button>
                    </div>

                 </div>
            </div>
            <div class="content-main flex1">
                <div class="content-left bg-1 flex1 animated slideInLeft">
                    <div class="content-title">游客分布</div>
                    <div class="bg-main-1" id="portrait_1"></div>
                </div>
                <div class="content-right flex1">
                    <div class="portrait-box flex1">
                        <div class="bg-1 flex1 animated slideInDown delay-1">
                            <div class="content-title">性别占比</div>
                            <div class="bg-main-1" id="portrait_2"></div>
                        </div>
                        <div class="bg-1 flex1 animated slideInDown delay-1">
                            <div class="content-title">年龄分布</div>
                            <div class="bg-main-1" id="portrait_3"></div>
                        </div>
                    </div>
                    <div class="portrait-box flex1">
                        <div class="bg-1 flex1 animated slideInRight delay-2">
                            <div class="content-title">游客偏好</div>
                            <div class="bg-main-1" id="portrait_4"></div>
                        </div>
                        <div class="bg-1 flex1 animated slideInRight delay-2">
                            <div class="content-title">游客出行方式</div>
                            <div class="bg-main-1" id="portrait_5"></div>
                        </div>
                    </div>

                    <div class="bg-1 flex1 animated slideInUp delay-3" style="margin-left: 16px">
                        <div class="content-title">客源地</div>
                        <div class="bg-main-1 place-box">
                            <ul>
                                <li class="active">客源省TOP10</li>
                                <li>客源城市TOP10</li>
                            </ul>
                            <div id="portrait_6" class="flex1"></div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script src="./assets/plugin/jquery.min.js"></script>
<script src="./assets/plugin/ECharts/echarts.js"></script>
<script src="./assets/plugin/ECharts/china.js"></script>
<script src="./assets/plugin/laydate/laydate.js"></script>
<script src="./assets/plugin/M_select/M_select.js"></script>
<script src="./assets/js/public.js"></script>
<script src="./assets/js/tongji_ykhx.js"></script>

</html>
